<template>
  <!-- 归档任务管理 -->
  <div class="IntegrationSh">
    <!-- <div class="seach-content">
      <div class="demo-input-suffix">
        任务分类：
        <el-cascader v-model="value" :props="props"></el-cascader>
        <el-button type="primary" @click="search()"
          ><i class="el-icon-zoom-in el-icon--left"> 搜索</i></el-button
        >
        <el-button @click="reset()"
          ><i class="el-icon-refresh el-icon--left"> 重置</i></el-button
        >
      </div>
    </div> -->
    <div class="btn-continer">
      <el-button
        type="success"
        class="btn-lvse"
        @click="submit"
        style="margin-right: 10px"
        ><i class="el-icon-success el-icon--left"> 通过</i></el-button
      >

      <el-popconfirm confirm-button-text="好的" cancel-button-text="不用了">
      </el-popconfirm>
      <el-popover
        v-model="popover"
        placement="right"
        width="400"
        trigger="click"
      >
        <span>
          <el-input
            v-model="thval"
            placeholder="请输入退回意见"
            style="width: 75%; margin-right: 10px"
          ></el-input>
        </span>
        <span>
          <el-button type="primary" @click="goBack" class="btn-lanse">
            确定</el-button
          ></span
        >

        <el-button type="danger" slot="reference" class="btn-hongse"
          ><i class="el-icon-arrow-right el-icon--left"> 退回</i></el-button
        ></el-popover
      >
      <!-- <el-button><i class="el-icon-refresh el-icon--left"> 撤销</i></el-button> -->

      <div class="btn-right">
        <el-button
          icon="el-icon-refresh-right"
          circle
          @click="refresh()"
        ></el-button>
      </div>
    </div>
    <div class="table-continer">
      <el-table
        :data="tableData"
        v-loading="loading"
        :highlight-current-row="true"
        :header-cell-style="{ background: '#F0F0F6', color: '#2D3548' }"
        row-key="id"
        style="width: 100%"
        @selection-change="selectionClick"
        ref="multipleTable"
      >
        <el-table-column type="selection" width="55"> </el-table-column>
        <el-table-column fixed label="名称">
          <template slot-scope="scope">
            <span style="height: 16px; display: inline-block"
              ><img
                src="../assets/bao.png"
                alt=""
                style="margin-top: 3px; display: block"
            /></span>
            {{ scope.row.tlabelInfo ? scope.row.tlabelInfo.name : "" }}
          </template>
        </el-table-column>
        <el-table-column label="类型">
          <template slot-scope="scope">
            <span>{{
              scope.row.tlabelInfo ? scope.row.tlabelInfo.valueType : ""
            }}</span>
          </template>
        </el-table-column>
        <el-table-column label="创建人">
          <template slot-scope="scope">
            <span>{{
              scope.row.tlabelInfo ? scope.row.tlabelInfo.crator : ""
            }}</span>
          </template>
        </el-table-column>
        <el-table-column label="创建时间">
          <template slot-scope="scope">
            <span>{{
              scope.row.tlabelInfo ? scope.row.tlabelInfo.createTime : ""
            }}</span>
          </template>
        </el-table-column>
        <el-table-column label="状态">
          <template slot-scope="scope">
            <span
              v-if="scope.row.tlabelInfo ? scope.row.tlabelInfo.state == 0 : ''"
              >暂存</span
            >
            <span
              v-if="scope.row.tlabelInfo ? scope.row.tlabelInfo.state == 1 : ''"
              >待审核</span
            >
            <span
              v-if="scope.row.tlabelInfo ? scope.row.tlabelInfo.state == 2 : ''"
              >审核通过</span
            >
            <span
              v-if="scope.row.tlabelInfo ? scope.row.tlabelInfo.state == 3 : ''"
              >否决</span
            >
            <span
              v-if="scope.row.tlabelInfo ? scope.row.tlabelInfo.state == 4 : ''"
              >删除待审核</span
            >
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="Pagination">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        background
        :current-page="currentPage"
        :page-sizes="[5, 10, 15]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="totalSize"
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  name: "IntegrationSh",
  data() {
    return {
      currentPage: 1,
      loading: false,
      tableData: [],
      thval: "",
      pageSize: 10,
      totalSize: 0,
      selectId: [],
      popover: false,
    };
  },
  mounted() {
    this.getList();
  },
  methods: {
    getList() {
      this.loading = true;
      let obj = {
        pageNum: this.currentPage,
        pageSize: this.pageSize,
        state: 0,
      };
      this.$api
        .TselectList(obj)
        .then((res) => {
          if (res.code == 200) {
            this.tableData = res.data.list;
            this.totalSize = res.data.total;
          } else {
            this.tableData = [];
            this.totalSize = 0;
          }
          this.loading = false;
          this.selectId = [];
        })
        .catch(() => {
          this.tableData = [];
          this.totalSize = 0;
          this.loading = false;
          this.selectId = [];
        });
    },

    submit() {
      this.selectId.forEach((res) => {
        delete res.tlabelInfo;
        delete res.fileInfo;
        delete res.fileLabelList;
        res.auditOpinion = 0;
        res.businessType = 1;
      });
      if (this.selectId.length == 0) {
        this.$message({
          showClose: true,
          message: "请选择一条数据进行通过",
          type: "warning",
        });
        return;
      }

      this.$api.Tapproval(this.selectId).then((res) => {
        console.log(res);
        if (res.code == 200) {
          this.$message.closeAll();
          this.$message({
            showClose: true,
            message: res.msg,
            type: "success",
          });
          this.currentPage = 1;
          this.getList();
        }
      });
    },
    goBack() {
      this.selectId.forEach((res) => {
        delete res.tlabelInfo;
        delete res.fileInfo;
        delete res.fileLabelList;
        res.auditOpinion = 1;
        res.auditContent = this.thval;
        res.businessType = 1;
      });

      if (this.selectId.length == 0) {
        this.$message({
          showClose: true,
          message: "请选择一条数据进行退回",
          type: "warning",
        });
        return;
      }
      // console.log(arr,'arr')
      // return false
      this.$api.Tapproval(this.selectId).then((res) => {
        console.log(res);
        if (res.code == 200) {
          this.$message.closeAll();
          this.$message({
            showClose: true,
            message: res.msg,
            type: "success",
          });
          this.currentPage = 1;
          this.getList();
          this.popover = false;
        }
      });
    },
    selectionClick(row) {
      this.selectId = row;
    },
    refresh() {
      this.currentPage = 1;
      this.getList();
    },
    handleSizeChange(val) {
      this.pageSize = val;
      // console.log(`每页 ${val} 条`);
      this.getList();
    },
    handleCurrentChange(val) {
      this.currentPage = val;
      // console.log(`当前页: ${val}`);
      this.getList();
    },
  },
};
</script>
<style scoped lang="scss">
.IntegrationSh {
  padding: 0 30px;
  overflow: hidden;
  .seach-content {
    margin-top: 20px;
  }
  /deep/.el-button--primary {
    margin-left: 10px;
  }
  .content {
    height: 520px;
  }
  .pright {
    margin-right: 10px;
  }
  .btn-continer {
    margin-top: 30px;
    margin-bottom: 20px;
    .btn-right {
      float: right;
    }
  }
  .Pagination {
    text-align: right;
    margin-top: 40px;
  }
}
</style>

